<body class="app" data-ad="true">
<script type="text/javascript" src="/mobile/js/lrz.bundle.js"></script>
<section class="app-content">
	<form enctype="multipart/form-data" action="<?php echo $this->url('myorder', array('action'=>'after-sales-save'));?>" method="post" name="form1" id="form1" >
	<input type="hidden" value="<?php echo $this->escapeHtml($order['order_no']);?>" name="order_no"/>
	<section class="page page-index bw noline" data-plugin-type="info_front">
        <div class="top-bar">售后服务<a href="<?php echo $this->url('myorder', array('action'=>'index'));?>" class="btn-t-back"></a></div>
        <div class="af-sales-order">
            <p class="af-l"><?php echo $this->escapeHtml($order['status_name']);?><span class="fl">订单日期：<?php echo $this->escapeHtml($order['order_create_time']);?></span></p>
            <table class="o-info-list">
                <tbody>
                <?php foreach ($orderitems as $key => $item) : ?>
                    <tr class="tr_orderitem">
                        <input type="hidden" value="<?php echo $this->escapeHtml($item['oi_id']);?>" name="item_id_<?php echo $key;?>"/>
                        <input type="hidden" value="0" name="item_num_<?php echo $key;?>" class="sp-item-num"/>
                        <input type="hidden" value="<?php echo $this->escapeHtml($item['oi_amount']);?>" class="sp-item-amount" name="item_amount"/>
                        <td class="o-01"><span><?php echo $this->escapeHtml($item['oi_name']);?></span></td>
                        <td class="o-02">¥ <?php echo $this->escapeHtml($item['oi_price']);?></td>
                        <td class="o-03 sp-item"><div class="ope-line">
                        <a class="btn-ope btn-ope-minus" href="javascript:;"></a><span class="sp-ope-num">0</span><a class="btn-ope btn-ope-plus" href="javascript:;"></a>
                    </div></td>
                    </tr>
                <?php endforeach; ?>
                                
                </tbody>

            </table>
        </div>
        <div class="af-sales-server">
            <h3 class="af-tit">服务类型</h3>
            <div class="ser-mode"><a class="" href="javascript:;">退 货</a></div>
        </div>
        <div class="af-sales-server">
            <h3 class="af-tit">问题描述</h3>
            <div class="reason-con">
                <textarea name="mark" id="text-upload" maxlength="50" placeholder="请您在此描述详细问题"></textarea>
                <span class="rel-line"><i>0</i> / 50</span>
            </div>
        </div>
        <div class="af-sales-server">
            <h3 class="af-tit">上传照片</h3>
            <div class="goods-list">
                <div class="goods-img goods-img-add">
                    <img id="pic_1" name="pic_1" src="/mobile/images/ico/ico-add-b.png" />
                    <input id="picFile_1" name="picFile_1" type="file" capture="camera" accept="image/*">
                    <a id="picDel_1" href="javascript:delePic(1);" class="btn-ele-del" style="display:none"></a>
                </div>
                <div class="goods-img goods-img-add">
                	
                	<img id="pic_2" name="pic_2" src="/mobile/images/ico/ico-add-b.png">
                	<input id="picFile_2" name="picFile_2" type="file" capture="camera" accept="image/*">
                	<a id="picDel_2" href="javascript:delePic(2);" class="btn-ele-del" style="display:none"></a>
                </div>
                <div class="goods-img goods-img-add">
     
                	<img id="pic_3" name="pic_3" src="/mobile/images/ico/ico-add-b.png">
                	<input id="picFile_3" name="picFile_3" type="file" capture="camera" accept="image/*">
                	<a id="picDel_3" href="javascript:delePic(3);" class="btn-ele-del" style="display:none"></a>
                </div>
                <div class="goods-img goods-img-add">
       
                	<img id="pic_4" name="pic_4" src="/mobile/images/ico/ico-add-b.png">
                	<input id="picFile_4" name="picFile_4" type="file" capture="camera" accept="image/*">
                	<a id="picDel_4" href="javascript:delePic(4);" class="btn-ele-del" style="display:none"></a>
                </div>
            </div>

        </div>
        <a class="btn-w btn-yel02" href="javascript:formSub();">确 认</a>
	</section>
	</form>

</section>

<script type="text/javascript">
function delePic(id){
	$('#pic_'+id).attr("src","/mobile/images/ico/ico-add-b.png");
	$('#picFile_'+id).hide();
	$('#picDel_'+id).val('');
}

function formSub(){
	var t_amount = 0;
	<?php foreach ($orderitems as $key => $item) : ?>
	t_amount = t_amount + parseInt($("[name='item_num_<?php echo $key;?>']").val());	
	<?php endforeach; ?>

	if (t_amount < 1) {
		alert('请选择你要退款的商品');
		return;
	}
	var text = $("#text-upload").val();
	if (!text) {
		alert('请填写问题描述');
		return;
	}
	
	$("#form1").submit();
}

$(function () {

    var maxstrlen = 50;
    var wck = $('.rel-line').find('i');
    $("#text-upload").keyup(function () {
        len = maxstrlen;
        var str = $(this).val();
        myLen = getStrleng(str);
        if (myLen > len * 2) {
            $(this).value = str.substring(0, i + 1);
        }
        else {
            wck.html(Math.floor((len * 2 - myLen) / 2));
        }
    });
    function getStrleng(str) {
        myLen = 0;
        i = 0;
        for (; (i < str.length) && (myLen <= maxstrlen * 2); i++) {
            if (str.charCodeAt(i) > 0 && str.charCodeAt(i) < 128)
                myLen++;
            else
                myLen += 2;
        }
        return myLen;
    }
    
    //加减产品数量
    $('.btn-ope-plus').unbind('click');
    $('.btn-ope-minus').unbind('click');
    
  //商品加减操作
    $('.btn-ope-plus').click(function(){
    	var cur_oi =	$(this).parents('.tr_orderitem');
    	var item_amount = cur_oi.find(".sp-item-amount").val();
        var cur_obj = $(this).parents('.ope-line')
        var cur_num_obj = cur_obj.find('.sp-ope-num');
        var t_num = parseInt(cur_num_obj.html())+1;
        console.log('amoutn:'+item_amount);
        cur_num_obj.html(t_num);
        cur_oi.find('.sp-item-num').val(t_num);
        if(t_num>0){
            cur_obj.find('.btn-ope-minus,.sp-ope-num').css('visibility','visible');
        }
        if(t_num == item_amount) {
        	cur_obj.find('.btn-ope-plus').css('visibility','hidden');
        }
    })

    $('.btn-ope-minus').click(function(){
    	var cur_oi =	$(this).parents('.tr_orderitem');
    	var item_amount = cur_oi.find(".sp-item-amount").val();
        var cur_obj = $(this).parents('.ope-line')
        var cur_num_obj = cur_obj.find('.sp-ope-num');
        var t_num = parseInt(cur_num_obj.html());
        if(t_num==1){
            cur_obj.find('.btn-ope-minus,.sp-ope-num').css('visibility','hidden');
        }
        cur_num_obj.html(t_num-1);
        cur_oi.find('.sp-item-num').val(t_num-1);
        if(t_num <= item_amount) {
        	cur_obj.find('.btn-ope-plus').css('visibility','visible');
        }
    })

    $(document).on("change","input[type='file']",function(){
    	var o=this;
		lrz(this.files[0])
		.then(function (rst) {
			//console.log(rst);
          // 把处理的好的图片给用户看
			$(o).prev('img').attr("src",rst.base64);
			$(o).next('a').show();
		})
		.catch (function (err) {
			loadCommonPop("图片错误！");
		})
		.always(function () {

		});
    });
});
</script>
